<template>
    <div id="app">
      <router-view></router-view>
    </div>
</template>

<script>
    export default {
        name: 'App',
        data() {
            return {
            }
        },
        methods: {
        }
    }
</script>

<style>
    #app {
        font-family: Avenir, Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        color: #2c3e50;
      background: white;
      font-family:"Microsoft YaHei",微软雅黑,"Microsoft JhengHei",华文细黑,STHeiti,MingLiu;
      height: 100%;
    }

    .el-table .warning-row {
        background: oldlace;
    }

    .el-table .success-row {
        background: #f0f9eb;
    }

    .el-row {
        margin-bottom: 20px;
    }

    .el-col {
        border-radius: 4px;
    }

    .bg-purple-dark {
        background: #99a9bf;
    }

    .bg-purple {
        background: #d3dce6;
    }

    .bg-purple-light {
        background: #e5e9f2;
    }

    .grid-content {
        border-radius: 4px;
        min-height: 36px;
    }

    .row-bg {
        padding: 10px 0;
        background-color: #f9fafc;
    }
    *{
      margin: 0;
      padding: 0;
    }
</style>

<!--分页源码-->
<!--<template>-->
<!--  <div class="app">-->
<!--    &lt;!&ndash; 将获取到的数据进行计算 &ndash;&gt;-->
<!--    <el-table :data="tableData.slice((currentPage-1)*PageSize,currentPage*PageSize)" style="width: 100%">-->
<!--      <el-table-column prop="date" label="日期" width="180"></el-table-column>-->
<!--      <el-table-column prop="name" label="姓名" width="180"></el-table-column>-->
<!--      <el-table-column prop="address" label="地址"></el-table-column>-->
<!--    </el-table>-->
<!--    <el-pagination @size-change="handleSizeChange"-->
<!--                   @current-change="handleCurrentChange"-->
<!--                   :current-page="currentPage"-->
<!--                   :page-sizes="pageSizes"-->
<!--                   :page-size="PageSize" layout="total, sizes, prev, pager, next, jumper"-->
<!--                   :total="totalCount">-->
<!--    </el-pagination>-->
<!--  </div>-->
<!--</template>-->
<!--<script>-->
<!--export default {-->
<!--  data(){-->
<!--    return {-->
<!--      tableData:[],-->
<!--      // 默认显示第几页-->
<!--      currentPage:1,-->
<!--      // 总条数-->
<!--      totalCount:1,-->
<!--      // 个数选择器-->
<!--      pageSizes:[1,2,3,4],-->
<!--      // 默认每页显示的条数-->
<!--      PageSize:2,-->
<!--    }-->
<!--  },-->
<!--  methods:{-->
<!--    getTabData(){-->
<!--      //此处直接赋值代替发Ajax获取数据-->
<!--      this.tableData=[{-->
<!--        date: '2016-05-02',-->
<!--        name: '王小虎',-->
<!--        address: '上海市普陀区金沙江路 1518 弄'-->
<!--      }, {-->
<!--        date: '2016-05-04',-->
<!--        name: '王小虎',-->
<!--        address: '上海市普陀区金沙江路 1517 弄'-->
<!--      }, {-->
<!--        date: '2016-05-01',-->
<!--        name: '王小虎',-->
<!--        address: '上海市普陀区金沙江路 1519 弄'-->
<!--      }, {-->
<!--        date: '2016-05-03',-->
<!--        name: '王小虎',-->
<!--        address: '上海市普陀区金沙江路 1516 弄'-->
<!--      },{-->
<!--        date: '2016-05-02',-->
<!--        name: '王小虎',-->
<!--        address: '上海市普陀区金沙江路 1518 弄'-->
<!--      }, {-->
<!--        date: '2016-05-04',-->
<!--        name: '王小虎',-->
<!--        address: '上海市普陀区金沙江路 1517 弄'-->
<!--      }, {-->
<!--        date: '2016-05-01',-->
<!--        name: '王小虎',-->
<!--        address: '上海市普陀区金沙江路 1519 弄'-->
<!--      }, {-->
<!--        date: '2016-05-03',-->
<!--        name: '王小虎',-->
<!--        address: '上海市普陀区金沙江路 1516 弄'-->
<!--      }]-->

<!--      this.totalCount=this.tableData.length-->

<!--    },-->
<!--    // 分页-->
<!--    // 每页显示的条数-->
<!--    handleSizeChange(val) {-->
<!--      // 改变每页显示的条数-->
<!--      this.PageSize=val-->
<!--      // 在改变每页显示的条数时，要将页码显示到第一页-->
<!--      this.currentPage=1-->
<!--    },-->
<!--    // 显示第几页-->
<!--    handleCurrentChange(val) {-->
<!--      // 改变默认的页数-->
<!--      this.currentPage=val-->
<!--    },-->
<!--  },-->
<!--  created:function(){-->
<!--    this.getTabData()-->
<!--  }-->
<!--}-->
<!--</script>-->

<!--批量删除-->
<!--this.multipleSelection 存放的就是你目前选中的所有项。-->



<!--// 点击删除全部时-->

<!--this.multipleSelection.forEach(selectedItem => {-->

<!--// 删除请求-->

<!--axios({-->

<!--url: '/xxxxxxx/delete/' + selectedItem.id,-->

<!--method: 'get',-->

<!--dataType: 'json'-->

<!--})-->

<!--})-->

<!--PS: 上述已经能够处理批量删除请求了，不过需要执行批量全部成功删除的回调的话，要么用axios.all，要么用Promise.all，原理都差不多-->

<!--文档不是有写吗select事件....文档位置。-->
<!--一开始定义一个需要删除的数组，在每次勾选的时候存入数组，批量删除按钮点击时，删除数组里的元素就完了撒....-->
<!--框架不可能所有情况都给你考虑进去了，变通一下就实现了嘛.....-->